<!DOCTYPE html>
<html lang="en"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.thymeleaf.org"
      layout:decorator="layout/pc_master">
<div layout:fragment="content" class="section page-content">
<style type="text/css">
    .bcui_voice { width: 200px; height: 200px; }
</style>
    <!-- s: 导航 -->
    <div class="breadcrumb-wrap">
        <div class="layui-main clearfix">
            <div class="breadcrumb">
                <a href="/">首页</a> - <a href="/center">用户中心</a> - 单身资料
            </div>
        </div>
    </div>
    <!-- e: 导航 -->

    <div class="section page-content">
        <div class="layui-main clearfix">

         <div th:include="layout/center_left :: center_left" class="manage-aside"></div>

        <div class="manage-main">
            <ul class="layui-nav nav main-nav">
                <li class="layui-nav-item ">
                    <a href="/center/single/info">
                        基本资料
                    </a>
                </li>
                <li class="layui-nav-item ">
                    <a href="/center/single/mate">
                        择偶标准
                    </a>
                </li>
                <li class="layui-nav-item ">
                    <a href="/center/single/photo">
                        头像
                    </a>
                </li>
                <li class="layui-nav-item layui-this">
                    <a href="/center/single/show">
                        个性展示
                    </a>
                </li>
            </ul>

            <div class="main-content">
                <fieldset class="layui-elem-field layui-field-title" >
                    <legend>
                        我的声音
                    </legend>
                </fieldset>
                <div class="bcui-alert bcui-alert-warning" th:if="${singles.voiceCheck eq 3}">
                    提示：您的声音正在审核中，请耐心等待～
                </div>
                <div class="photobox" style="padding:50px 0;text-align: center;">
                    <div class="voicebox">
                        <div class="bcui_voice" style="">
                            <div class="bcui_voice_back"
                                 th:style="'background-image:url('+${singles.photo+'_200x200.jpg'}">
                            </div>
                            <audio controls="controls" hidden="" id="voice_661" preload="" th:src="${singles.voice}">
                            </audio>
                            <div class="bcui_voice_btn">
                            </div>
                        </div>
                        <div class="placeholder" style="border-radius: 100% ; display: inline-block; width: 200px; height: 200px; text-align: center; display: none;">
                            <img src="/m/img/speak.svg" style="width:100%; height:100%;vertical-align: middle;overflow: hidden;margin:0">

                        </div>
                    </div>
                    <div style="height: 20px;"></div>
                    <button class="btn js_up_recorder">
                        上传
                    </button><input class="layui-upload-file" type="file" accept="voice" name="file">
                    <button class="btn btn-invalid js_del_recorder">
                        删除
                    </button>
                </div>



                <fieldset class="layui-elem-field layui-field-title" style="margin-top: 100px;">
                    <legend>
                        我的视频
                    </legend>
                </fieldset>
                <div class="bcui-alert bcui-alert-warning" th:if="${singles.videoCheck}">
                    提示：您的视频正在审核中，请耐心等待～
                </div>
                <div class="photobox" style="padding:50px 0;text-align: center;">
                    <div class="videobox">
                        <video controls="controls" height="200" preload="" th:src="${singles.video}" style="background: #000" width="300">
                        </video>
                    </div>
                    <div style="height: 20px;"></div>
                    <button class="btn js_up_video">
                        上传
                    </button><input class="layui-upload-file" type="file" accept="video" name="file">
                    <button class="btn btn-invalid js_del_video">
                        删除
                    </button>
                </div>
            </div>

        </div>


        </div>
    </div>

</div>
<div layout:fragment="contentFooter">
    <script type="text/javascript" src="/pc/js/center/single/show.js"></script>
</div>
</html>